<template>
  <div class="list-table">
    <template v-if="roundList.length>0">
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane v-for="item in roundList" :key="item.id" :label="item.name" :name="item.id">
          <el-row :gutter="10" class="mb8">
            <el-col :span="24">
              <el-button type="success" icon="el-icon-download" size="mini" @click="batchDownload">批量下载</el-button>
            </el-col>
          </el-row>
          <el-table
            v-loading="loading"
            :data="fileDataList"
            :span-method="objectSpanMethod"
            border
            style="width: 100%"
            class="noneHoverBg"
          >
            <el-table-column
              min-width="150"
              prop="parentNodeName"
              :label="$t('一级阶段')"
            >
              <template slot-scope="scope">
                <span>{{ $t(scope.row.parentNodeName) }}</span>
              </template>
            </el-table-column>
            <el-table-column
              min-width="150"
              prop="nodeName"
              :label="$t('二级阶段')"
            >
              <template slot-scope="scope">
                <span>{{ $t(scope.row.nodeName) }}</span>
              </template>
            </el-table-column>
            <el-table-column
              prop="restartNum"
              :label="$t('轮次')"
              width="70"
              align="center"
            />
            <el-table-column
              min-width="150"
              prop="fileType"
              :label="$t('文档类型')"
            >
              <template slot-scope="scope">
                <span>{{ $t(scope.row.fileType) }}</span>
              </template>
            </el-table-column>
            <el-table-column
              min-width="300"
              prop="fileName"
              :label="$t('文档名称')"
            >
              <template slot-scope="scope">
                <el-link type="primary" @click="previewFile(scope.row)">
                  <el-tooltip :content="scope.row.fileName" placement="right-end">
                    <span>{{ scope.row.fileName }}</span>
                  </el-tooltip>
                </el-link>
              </template>
            </el-table-column>
            <el-table-column
              min-width="150"
              prop="fileType"
              :label="$t('上传人')"
            >
              <template slot-scope="scope">
                <span>{{ $t(scope.row.createBy) }}</span>
              </template>
            </el-table-column>
            <el-table-column
              :label="$t('操作')"
              width="90"
              align="center"
            >
              <template v-if="scope.row.fileId !== null && scope.row.fileName !== null && scope.row.fileName !== '' && configDownloadEnabled" slot-scope="scope">
                <el-button
                  size="small"
                  type="text"
                  icon="el-icon-download"
                  @click="downloadFile(scope.row.fileId)"
                >{{ $t('下载') }}
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>
      </el-tabs>
    </template>
    <template v-else>
      <el-row :gutter="10" class="mb8">
        <el-col :span="24">
          <el-button type="success" icon="el-icon-download" size="mini" @click="batchDownload">批量下载</el-button>
        </el-col>
      </el-row>
      <el-table
        v-loading="loading"
        :data="fileDataList"
        :span-method="objectSpanMethod"
        border
        style="width: 100%"
        class="noneHoverBg"
      >
        <el-table-column
          min-width="150"
          prop="parentNodeName"
          :label="$t('一级阶段')"
        >
          <template slot-scope="scope">
            <span>{{ $t(scope.row.parentNodeName) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          min-width="150"
          prop="nodeName"
          :label="$t('二级阶段')"
        >
          <template slot-scope="scope">
            <span>{{ $t(scope.row.nodeName) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="restartNum"
          :label="$t('轮次')"
          width="70"
          align="center"
        />
        <el-table-column
          min-width="150"
          prop="fileType"
          :label="$t('文档类型')"
        >
          <template slot-scope="scope">
            <span>{{ $t(scope.row.fileType) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          min-width="300"
          prop="fileName"
          :label="$t('文档名称')"
        >
          <template slot-scope="scope">
            <el-link type="primary" @click="previewFile(scope.row)">
              <el-tooltip :content="scope.row.fileName" placement="right-end">
                <span>{{ scope.row.fileName }}</span>
              </el-tooltip>
            </el-link>
          </template>
        </el-table-column>
        <el-table-column
          min-width="150"
          prop="fileType"
          :label="$t('上传人')"
        >
          <template slot-scope="scope">
            <span>{{ $t(scope.row.createBy) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          :label="$t('操作')"
          width="90"
          align="center"
        >
          <template v-if="scope.row.fileId !== null && scope.row.fileName !== null && scope.row.fileName !== '' && configDownloadEnabled" slot-scope="scope">
            <el-button
              size="small"
              type="text"
              icon="el-icon-download"
              @click="downloadFile(scope.row.fileId)"
            >{{ $t('下载') }}
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </template>

    <!--    @click="DownloadFile(scope.row.id)"-->
    <!--预览文件-->
    <OnlinePreview ref="OnlinePreview" />
  </div>
</template>

<style scoped>
</style>

<script>
import { findWfFile, findRoundList } from '@/api/file/wf/wfFileView'
import { downLoadFileOpen, downLoadFilePost } from '@/utils/zipdownload'
export default {
  data() {
    return {
      // 查询参数
      queryParams: {
        busId: this.$route.query.id,
        roundId: undefined
      },
      fileDataList: [],
      // 上一个一级节点
      parentNodeNameLast: '',
      // 上一个二级节点
      nodeNameLast: '',
      configDownloadEnabled: true,
      loading: false,
      activeName: '',
      roundList: [] // 多轮投资
    }
  },
  created() {
    // 全局下载开关
    this.getConfigKeyToDownload('enable_download').then(response => {
      this.configDownloadEnabled = (response.msg === 'true')
    })
    this.getRoundList()
    // this.findWfFile()
  },
  methods: {
    objectSpanMethod({ rowIndex, columnIndex }) {
      if (columnIndex === 0 || columnIndex === 1 || columnIndex === 2) {
        const spanArr = this.rowspanRounds(columnIndex)
        for (let i = 0; i < spanArr.length; i++) {
          const _row = spanArr[rowIndex]
          return {
            rowspan: _row,
            colspan: 1
          }
        }
      }
    },
    rowspanRounds(columnIndex) {
      // 二维数组，用于存放单元格合并规则
      const spanArr = []
      // 用于存储相同项的开始index
      let position = 0
      this.fileDataList.forEach((item, index) => {
        if (index === 0) {
          spanArr.push(1)
          position = 0
        } else {
          if (columnIndex === 0 && this.fileDataList[index].parentNodeName === this.fileDataList[index - 1].parentNodeName) {
            spanArr[position] += 1 // 有相同项
            spanArr.push(0) // 名称相同后往数组里面加一项0
          } else if (columnIndex === 1 && this.fileDataList[index].nodeName === this.fileDataList[index - 1].nodeName) {
            spanArr[position] += 1 // 有相同项
            spanArr.push(0) // 名称相同后往数组里面加一项0
          } else if (columnIndex === 2 && (this.fileDataList[index].restartNum === this.fileDataList[index - 1].restartNum && this.fileDataList[index].nodeName === this.fileDataList[index - 1].nodeName)) {
            spanArr[position] += 1 // 有相同项
            spanArr.push(0) // 名称相同后往数组里面加一项0
          } else {
            spanArr.push(1) // 同列的前后两行单元格不相同
            position = index
          }
        }
      })
      return spanArr
    },
    // 流程文档
    findWfFile() {
      this.loading = true
      findWfFile(this.queryParams).then(response => {
        this.fileDataList = response.data
        this.loading = false
      })
    },
    // 预览附件
    previewFile(row) {
      this.$refs.OnlinePreview.onlinePreviewFile(row.fileId)
    },
    // 文件下载
    downloadFile(id) {
      downLoadFileOpen(id)
    },
    cellMouseEnter({ row, column, cell, event }) {
      console.log(row, column, cell, event)
    },
    // 查询投资轮次
    getRoundList() {
      findRoundList(this.queryParams.busId).then(res => {
         if (res.code === 200) {
          this.roundList = res.data
          if (res.data.length > 0) {
            this.activeName = res.data[0].id
            this.queryParams.roundId = res.data[0].id
          }
         }
         this.findWfFile()
      })
    },
    handleClick(tab) {
      this.queryParams.roundId = tab.name
      this.findWfFile()
    },
    batchDownload() {
      this.$confirm('是否批量导出?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        downLoadFilePost('/wf/fileBase/batchDownloadFileZip', this.queryParams)
      })
    }
  }
}
</script>
